<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>首页</title>
  <link rel="stylesheet" href="/libs/swiper/swiper.min.css">
  <link rel="stylesheet" href="/css/index.css">
</head>
<body>
  <!--捷径栏-->
  <div class="shortcut"></div>
  <!--/.捷径栏-->

  <!--导航栏-->
  <header class="header"></header>
  <!--/.导航栏-->

  <!--轮播图上的导航栏-->
  <div class="nav-main">
    <div class="layout">
      <div class="category">
      </div>
    </div>
  </div>
  <!--/.轮播图上的导航栏-->

  <!--轮播图-->
  <div class="board">
    <div class="layout">
      <div class="big-box">
        <div class="swiper-container">
          <div class="swiper-wrapper">
            <div class="swiper-slide swiper-slide-active">
              <div class="img swiper-zoom-container">
                <img src="/images/banner/banner1.jpg" alt="">
              </div>
            </div>
            <div class="swiper-slide">
              <div class="img swiper-zoom-container">
                <img src="/images/banner/banner2.jpg" alt=""></div>
            </div>
            <div class="swiper-slide">
              <div class="img swiper-zoom-container">
                <img src="/images/banner/banner3.jpg" alt=""></div>
            </div>
            <div class="swiper-slide swiper-slide-active">
              <div class="img swiper-zoom-container">
                <img src="/images/banner/banner4.jpg" alt="">
              </div>
            </div>
            <div class="swiper-slide">
              <div class="img swiper-zoom-container">
                <img src="/images/banner/banner5.jpg" alt=""></div>
            </div>
            <div class="swiper-slide">
              <div class="img swiper-zoom-container">
                <img src="/images/banner/banner6.jpg" alt=""></div>
            </div>
            <div class="swiper-slide">
              <div class="img swiper-zoom-container">
                <img src="/images/banner/banner7.jpg" alt=""></div>
            </div>
          </div>

          <!-- 如果需要分页器 -->
          <div class="swiper-pagination"></div>

          <!-- 如果需要导航按钮 -->
          <div class="swiper-button-prev"></div>
          <div class="swiper-button-next"></div>
        </div>
      </div>
    </div>
  </div>
  <!--/.轮播图-->

  <!--菜单栏-->
  <div class="home-menu">
    <div class="layout relative">
      <ul class="home-main clearfix">
        <!--第一列-->
        <li class="f-l home-1">
          <!--已登陆-->
          <div class="home-login clearfix"></div>

          <!--未登陆-->
          <div class="home-unlogin clearfix">
            <div class="f-l relative hw-name">
              <img src="/images/img_not_logged_in.png" alt="">
            </div>

            <div class="f-l">
              <div class="w-reg">
                您好，请
                <a href="javascript:void(0)">登陆</a>
                <span>&nbsp;/&nbsp;</span>
                <a href="javascript:void(0)">注册</a>
              </div>
              <div class="w-btn">
                <a href="javascript:void(0)" class="new">新人福利</a>
                <a href="javascript:void(0)">会员频道</a>
              </div>
            </div>
          </div>
        </li>
        <!--/.第一列-->

        <!--第二列-->
        <li class="f-l home-2">
          <ul class="clearfix">
            <li>
              <a href="javascript:void(0)">
                <div class="p-img">
                  <img src="/images/home-nav.png" alt="" class="img0">
                </div>
                <div class="p-dec">企业购特惠</div>
              </a>
            </li>

            <li>
              <a href="javascript:void(0)">
                <div class="p-img">
                  <img src="/images/home-nav.png" alt="" class="img1">
                </div>
                <div class="p-dec">会员领券</div>
              </a>
            </li>

            <li>
              <a href="javascript:void(0)">
                <div class="p-img">
                  <img src="/images/home-nav.png" alt="" class="img2">
                </div>
                <div class="p-dec">以旧换新</div>
              </a>
            </li>

            <li>
              <a href="javascript:void(0)">
                <div class="p-img">
                  <img src="/images/home-nav.png" alt="" class="img3">
                </div>
                <div class="p-dec">P40 Pro+</div>
              </a>
            </li>

            <li>
              <a href="javascript:void(0)">
                <div class="p-img">
                  <img src="/images/home-nav.png" alt="" class="img4">
                </div>
                <div class="p-dec">华为数码</div>
              </a>
            </li>

            <li>
              <a href="javascript:void(0)">
                <div class="p-img">
                  <img src="/images/home-nav.png" alt="" class="img5">
                </div>
                <div class="p-dec">荣耀数码</div>
              </a>
            </li>
          </ul>
        </li>
        <!--/.第二列-->

        <!--第三列-->
        <li class="f-l home-3">
          <div class="p-notice clearfix">
            <div class="icon-notice f-l">
              <a href="javascript:void(0)">
                <span>公告</span>
              </a>
            </div>
            <div class="p-notice-content">
              <ul class="p-notice-list">
                <li>
                  <a href="javascript:void(0)">掌上生活分期支付享笔笔现金补贴</a>
                </li>
                <li>
                  <a href="javascript:void(0)">青稞智能指纹锁Q7众测活动中奖名单</a>
                </li>
                <li>
                  <a href="javascript:void(0)">华为畅享20Pro新品上市公告</a>
                </li>
                <li>
                  <a href="javascript:void(0)">乳胶枕众测活动中奖名单</a>
                </li>
                <li>
                  <a href="javascript:void(0)">关于北京市疫情管控升级对物流时效和服务影响的公告</a>
                </li>
                <li>
                  <a href="javascript:void(0)">荣耀30S购机赠荣耀雪碧礼包中奖名单</a>
                </li>
              </ul>
            </div>
          </div>

          <div class="p-info">
            <ul class="clearfix">
              <li>
                <a href="javascript:void(0)">
                  <span><img class="img0" src="/images/home-nav.png" alt=""></span>
                  优购码
                </a>
              </li>
              <li>
                <a href="javascript:void(0)">
                  <span><img class="img1" src="/images/home-nav.png" alt=""></span>
                  更换电池
                </a>
              </li>
              <li>
                <a href="javascript:void(0)">
                  <span><img class="img2" src="/images/home-nav.png" alt=""></span>
                  补购保障
                </a>
              </li>
            </ul>
          </div>
        </li>
        <!--/.第三列-->
      </ul>


      <div class="home-promo">
        <ul class="clearfix">
          <li>
            <a href="/detail.html?id=133">
              <img src="/images/home-promo/home-1.png" alt="">
            </a>
          </li>

          <li>
            <a href="/detail.html?id=233">
              <img src="/images/home-promo/home-2.jpg" alt="">
            </a>
          </li>

          <li>
            <a href="/detail.html?id=246">
              <img src="/images/home-promo/home-3.jpg" alt="">
            </a>
          </li>

          <li>
            <a href="/detail.html?id=323">
              <img src="/images/home-promo/home-4.png" alt="">
            </a>
          </li>
        </ul>
      </div>
    </div>
  </div>
  <!--/.菜单栏-->

  <!--底部栏-->
  <footer class="footer"></footer>
  <!--/.底部栏-->

  <div class="sidebar"></div>

  <script src="/libs/require/require.js" data-main="js/index"></script>
</body>
</html>
